<!DOCTYPE html> <html lang=zh-cn style=--olcb-folder-code-block-max-height:80vh;--cnb-code-bg:rgb(255,255,255);--cnb-code-font-size:14.4px;--cnb-code-color:rgb(57,58,52)><!--
 Page saved with SingleFile 
 url: https://www.cnblogs.com/onepixel/p/5126046.html 
 saved date: Tue Dec 05 2023 10:57:32 GMT+0800 (中国标准时间)
--><meta charset=utf-8>
<meta name=viewport content="width=device-width, initial-scale=1.0">
<meta name=description content="在 ECMAScript 规范中，共定义了 7 种数据类型，分为 基本类型 和 引用类型 两大类，如下所示： 基本类型：String、Number、Boolean、Symbol、Undefined、Null 引用类型：Object 基本类型也称为简单类型，由于其占据空间固定，是简单的数据段，为了便于">
<meta property=og:description content="在 ECMAScript 规范中，共定义了 7 种数据类型，分为 基本类型 和 引用类型 两大类，如下所示： 基本类型：String、Number、Boolean、Symbol、Undefined、Null 引用类型：Object 基本类型也称为简单类型，由于其占据空间固定，是简单的数据段，为了便于">
<meta http-equiv=Cache-Control content=no-transform>
<meta http-equiv=Cache-Control content=no-siteapp>
<meta http-equiv=X-UA-Compatible content="IE=edge">
<title>判断JS数据类型的四种方法 - 一像素 - 博客园</title>
<style>.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody{-moz-border-radius:0 0 0 0!important;-webkit-border-radius:0 0 0 0!important;background:none!important;border:0!important;bottom:auto!important;float:none!important;height:auto!important;left:auto!important;line-height:1.1em!important;margin:0!important;outline:0!important;overflow:visible!important;padding:0!important;position:static!important;right:auto!important;text-align:left!important;top:auto!important;vertical-align:baseline!important;width:auto!important;box-sizing:content-box!important;font-family:"Consolas","Bitstream Vera Sans Mono","Courier New",Courier,monospace!important;font-weight:normal!important;font-style:normal!important;font-size:1em!important;min-height:inherit!important;min-height:auto!important}.syntaxhighlighter{width:100%!important;margin:1em 0 1em 0!important;position:relative!important;overflow:auto!important;font-size:1em!important}.syntaxhighlighter .line{white-space:pre!important}.syntaxhighlighter table{width:100%!important}.syntaxhighlighter table td.code{width:100%!important}.syntaxhighlighter table td.code .container{position:relative!important;z-index:1}.syntaxhighlighter table td.gutter .line{text-align:right!important;padding:0 .5em 0 1em!important}.syntaxhighlighter table td.code .line{padding:0 1em!important}.syntaxhighlighter{background-color:#fff!important}.syntaxhighlighter .line.alt1{background-color:#fff!important}.syntaxhighlighter .gutter{color:#afafaf!important}.syntaxhighlighter .gutter .line{border-right:3px solid #6ce26c!important}.syntaxhighlighter .plain{color:#000!important}.syntaxhighlighter .comments{color:#008200!important}.syntaxhighlighter .string{color:#00f!important}.syntaxhighlighter .keyword{color:#069!important}.syntaxhighlighter .keyword{font-weight:bold!important}.syntaxhighlighter code{white-space:pre-wrap;white-space:-moz-pre-wrap!important;white-space:-o-pre-wrap}.syntaxhighlighter .line{white-space:normal!important;line-height:1.8em!important}.syntaxhighlighter code{line-height:1.8em!important}.syntaxhighlighter table td.code{width:auto!important}.syntaxhighlighter .line.alt2{background-color:#f4f4f4!important}.syntaxhighlighter .gutter{width:35px!important}.syntaxhighlighter .gutter .line{border-right:2px solid #6ce26c!important}.syntaxhighlighter table td.gutter .line{padding:0 .5em 0 .5em!important;text-align:right!important}.syntaxhighlighter .keyword{font-weight:normal!important;color:#00f!important}.syntaxhighlighter div,.syntaxhighlighter code,.syntaxhighlighter table,.syntaxhighlighter table td,.syntaxhighlighter table tr,.syntaxhighlighter table tbody{font-size:12px!important}.sh-gutter .line,.sh-gutter code:not([class*="language-"]):not([class~="hljs"]){white-space:nowrap!important}body{tab-size:4}img{max-width:100%;height:auto}#blog_post_info_block{margin-top:20px}#BlogPostCategory{margin-bottom:10px}#EntryTag{margin-top:0!important}.cnblogs-markdown :not(pre,div,td)>code,.blogpost-body :not(pre,div,td)>code{font-family:"Courier New",sans-serif;font-size:12px;padding:0 5px;line-height:1.8;margin:0 3px;display:inline-block;overflow-x:auto;vertical-align:middle;border-radius:3px;background-color:#f6f6f6;color:#e83e8c}#author_profile{float:left;width:280px;margin-top:0;margin-bottom:10px;color:#000;margin-left:0;font-size:12px}#author_profile a:hover{text-decoration:underline}.author_avatar{vertical-align:top;float:left;margin-right:5px;padding-top:5px;padding-left:2px;border:0}.author_profile_info{float:left;line-height:18px}#div_digg{float:right;margin-bottom:10px;margin-right:30px;font-size:12px;width:125px;text-align:center;margin-top:10px}.diggit{float:left;width:46px;height:52px;background:url()no-repeat;text-align:center;cursor:pointer;margin-top:2px;padding-top:5px}.diggnum{font-size:14px;color:#075db3;font-family:Verdana}.buryit{float:right;margin-left:20px;width:46px;height:52px;background:url()no-repeat;text-align:center;cursor:pointer;margin-top:2px;padding-top:5px}.burynum{font-size:14px;color:#075db3;font-family:Verdana}.diggword{margin-top:5px;margin-left:0;font-size:12px;color:#808080}#div_digg a.tip:link,#div_digg a.tip:visited,#div_digg a.tip:hover,#div_digg a.tip:active{color:#075db3;text-decoration:none;border-bottom:none}#div_digg a.tip:hover,#div_digg a.tip:active{text-decoration:underline}#profile_block{margin-top:5px;line-height:1.5;text-align:left}#post_next_prev{line-height:1.8;font-size:12px}#post_next_prev a.p_n_p_prefix:link{text-decoration:none}#post_next_prev a.p_n_p_prefix:hover{text-decoration:underline}blockquote{border:2px solid #efefef;padding-left:10px;padding-right:10px;padding-top:5px;padding-bottom:5px;margin-top:10px;margin-bottom:10px}.blogpost-body blockquote{border-left:3px solid #e2dfdf;border-right:none;border-top:none;border-bottom:none;margin:10px 0}#cnblogs_post_body blockquote{background-image:none}.under-post-card{margin-top:10px;line-height:1.5}#green_channel{padding:10px 0;margin-bottom:10px;margin-top:10px;border:#c0c0c0 1px dashed;font-size:12px;width:350px;text-align:center}#green_channel a{background:url(%3D%3D)repeat-x;display:inline-block;padding:3px 8px;color:#fff;text-decoration:none;font-weight:bold;cursor:pointer;margin-right:10px;-moz-border-radius:5px;-webkit-border-radius:10px;-moz-box-shadow:0 1px 3px rgba(0,0,0,.5);-webkit-box-shadow:0 1px 3px rgba(0,0,0,.5);text-shadow:0-1px 1px rgba(0,0,0,.25);vertical-align:middle}#green_channel a:hover{background-image:url()}#green_channel #green_channel_digg{background-color:#2daebf}#green_channel #green_channel_follow{background-color:#e33100}#green_channel #green_channel_favorite{background-color:#ffb515}#green_channel #green_channel_wechat{background:none;padding:3px 2px;-moz-border-radius:none;-webkit-border-radius:none;-moz-box-shadow:none;-webkit-box-shadow:none;text-shadow:none}#green_channel #green_channel_wechat img{width:24px;height:24px;border:medium none;box-shadow:none;margin-left:5px;vertical-align:middle}#cnblogs_post_body{margin-bottom:20px}#cnblogs_post_body ul{margin-left:30px;padding-left:0}#cnblogs_post_body ul li{list-style-type:disc}#cnblogs_post_body table{border-collapse:collapse;word-break:break-word}.blogpost-body td,.blogpost-body td{border-collapse:collapse}#cnblogs_post_body img{max-width:100%!important}.ad_text_commentbox{margin-top:5px;margin-bottom:5px}#cnblogs_ch{margin-top:5px;line-height:1.8}#cnblogs_ch:empty{display:none}#opt_under_post{line-height:1.8}.recent_comment_author{text-align:right;margin-right:4px}#HistoryToday{max-width:600px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.recent_comment_body{word-wrap:break-word}#cnblogs_post_body{word-break:break-word}#cnblogs_post_body p{margin:10px auto}#cnblogs_post_body p{text-indent:0}#cnblogs_post_body h3{font-weight:bold;margin:10px 0}#div_digg .diggnum{line-height:1.5em!important}#div_digg .burynum{line-height:1.5em!important}#green_channel a:link,#green_channel a:visited,#green_channel a:active{color:#fff!important;border:none!important}.vertical-middle>*{vertical-align:middle}#blog-news{overflow:hidden}.bannerbar{line-height:0;text-align:left}.bannerbar.forpc{height:32px;display:flex}.bannerbar.forpc img{height:32px;width:auto}.syntaxhighlighter td{min-width:auto!important}.category-item-link{word-break:break-word}#cnblogs_c1{width:300px;height:250px}.sidebar-card-title-a,a.sidebar-card-title-a:link,a.sidebar-card-title-a:visited{font-style:inherit!important;font-weight:inherit!important;font-size:inherit!important;color:inherit!important}.sidebar-category-item-count{font-size:11px;font-weight:normal}@keyframes fadeIn{0%{opacity:0}100%{opacity:var(--cnb-code-toolbar-initial-opacity)}}.login_tips{background-image:url();background-repeat:no-repeat;margin-top:10px;padding:0 0 10px 25px;font-weight:400}.login_tips a{text-decoration:underline!important}#comment_nav{text-align:right;display:flex;align-items:center;width:100%}.comment-nav-left{margin-right:auto;margin-left:15px}.comment-nav-right{margin-left:auto}#comment_nav a{padding-left:10px}:root{--highlighted-line-bg:#d1e3c9;--highlighted-line-bg-dark:#264b33}:root{--cnblogs-current-collection-bg-color:rgba(245,245,245,.98);--cnblogs-current-collection-highlight-color:rgba(255,255,255,.9);--cnblogs-current-collection-hover-color:rgba(255,255,255,.7);--cnblogs-current-collection-active-color:rgba(255,255,255,.8);--cnblogs-current-collection-color:#000}@keyframes collapse{from{max-height:80vh;max-height:80vh;max-height:var(--olcb-folder-code-block-scroll-height,80vh)}to{max-height:80vh;max-height:80vh;max-height:var(--olcb-folder-code-block-max-height,80vh)}}@keyframes expand{from{max-height:80vh;max-height:80vh;max-height:var(--olcb-folder-code-block-max-height,80vh);overflow-y:hidden}to{max-height:"";max-height:"";max-height:var(--olcb-folder-code-block-scroll-height,"");overflow-y:hidden}}@keyframes modal-open{0%{height:0;opacity:0}95%{height:505px}100%{height:auto;opacity:1}}:root{--cnblogs-toc-bg-color:rgba(245,245,245,.98);--cnblogs-toc-highlight-color:rgba(255,255,255,.9);--cnblogs-toc-color:#000}@keyframes wb-fade-in{0%{opacity:0}to{opacity:.85}}/*!
 * ui-dialog.css
 * Date: 2014-07-03
 * https://github.com/aui/artDialog
 * (c) 2009-2014 TangBin, http://www.planeArt.cn
 *
 * This is licensed under the GNU LGPL, version 2.1 or later.
 * For details, see: http://www.gnu.org/licenses/lgpl-2.1.html
 */@-webkit-keyframes ui-dialog-loading{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@keyframes ui-dialog-loading{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}#EntryTag{margin-top:20px;font-size:9pt}*{margin:0;padding:0}html{height:100%}body{color:#000;font-family:"PingFang SC","Helvetica Neue","Helvetica","Arial","Microsoft Yahei",sans-serif;font-size:12px;min-height:101%;background-size:100%auto;background-attachment:fixed}#cnblogs_post_body h3{line-height:2.5em}#cnblogs_post_body img{width:auto;height:auto;max-height:100%}table{border-spacing:0}img{border:0}ul{word-break:break-all}li{list-style:none}h2{font-weight:normal}a:link{color:#000;text-decoration:none}a:visited{color:#000;text-decoration:none}a:hover{color:#f60;text-decoration:underline}a:active{color:#000;text-decoration:none}.clear{clear:both}#home{margin:0 auto;width:980px}#header{margin-top:2em}#blogTitle{height:60px;clear:both}#blogTitle h1{font-size:330%;font-weight:bold;line-height:1.5em;margin-top:10px;width:50%;float:left;display:inline;letter-spacing:1px}#blogTitle h2{margin-top:2em;margin-left:8em;line-height:1.5em;width:50%;float:left;display:inline;font-size:14px}#blogTitle h1 a,#blogTitle h2{color:#0378bb;font-family:"PingFang SC","Helvetica Neue","Helvetica","Arial","Microsoft Yahei",sans-serif;text-shadow:3px 3px 3px #fff}#blogLogo{float:right}#navigator{background-color:#3d97cb;height:60px;clear:both;margin-top:60px;position:relative}#navList{min-height:30px;float:left;margin-left:30px}#navList li{float:left}#navList a{margin:18px 10px 0 0;padding:0 10px;font:14px/1.5em"PingFang SC","Helvetica Neue","Helvetica","Arial","Microsoft Yahei",sans-serif;display:block}#navList a:link,#navList a:visited,#navList a:active{color:#fff}#navList a:hover{text-decoration:underline}.blogStats{float:right;margin-top:20px;margin-right:2px;text-align:right}#main{min-width:980px;text-align:left;clear:both;background:#fff}#mainContent .forFlow{float:none;width:auto}#mainContent{min-height:200px;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;word-break:break-all;float:left;width:700px;background:#fff}.postTitle{padding:0 100px 10px 20px;clear:both;border-left:12px solid #3d97cb}.postTitle a:link,.postTitle a:visited,.postTitle a:active{color:#0378bb}.postTitle a:hover{color:#f60;text-decoration:none}.postDesc{clear:both}.postDesc a:link,.postDesc a:visited,.postDesc a:active{color:#a3a3a3}.postDesc a:hover{color:#f60;text-decoration:none}#sideBar{min-height:200px;padding:0 5px 0 5px;margin-left:700px;-o-text-overflow:ellipsis;text-overflow:ellipsis;overflow:hidden;word-break:break-all;padding-bottom:20px;background:#f7fbfd}.newsItem .catListTitle{text-align:left;padding:5px 10px;border:1px solid #fff;background:#d9ebf5}.newsItem{padding:0 0 5px 0;margin-bottom:2em}.catListTitle{font-weight:bold;line-height:1.5em;font-size:110%;margin-top:15px;margin-bottom:10px;border-bottom:1px solid #000}.catListComment{line-height:1.5em}#sideBarMain{margin-top:45px}#sideBarMain ul{line-height:1.5em}.catListEssay,.catListPostCategory,.catListComment,.catListView,.catListFeedback{margin-bottom:2em}#blog-sidecolumn .catListTitle{text-align:left;padding:5px 10px;background:#d9ebf5;border-bottom:none;border:1px solid #fff}.catListEssay ul,.catListPostCategory ul,.catListComment ul,.catListView ul,.catListFeedback ul{padding-left:1em}.catListEssay ul li,.catListPostCategory ul li,.catListComment ul li,.catListView ul li,.catListFeedback ul li{margin:.5em}#blog-sidecolumn .catListBlogRank ul{margin-left:15px}#topics{min-height:200px;padding:1em}#topics .postTitle{font-size:230%;font-weight:bold;border-bottom:1px solid #5ea2d6;line-height:1.5em;padding-left:5px}.postBody{padding:5px 2px 5px 5px;border-bottom:1px solid #000}#EntryTag{color:#666}#EntryTag a{margin-left:5px}#EntryTag a:link,#EntryTag a:visited,#EntryTag a:active{color:#666}#EntryTag a:hover{color:#f60}#topics .postDesc{float:none;text-align:right;padding-right:5px;color:#666;margin-top:5px}.commentform{padding:0 5px 0 2em}#footer{text-align:center;min-height:15px;margin-top:10px;padding-top:10px;margin-bottom:10px;padding-bottom:10px;color:#3d97cb}.postBody p{text-align:justify}.postBody h3{color:#0378bb}.postBody a:link,.postBody a:visited,.postBody a:active{text-decoration:underline}.postBody li{margin-bottom:1em}.postBody blockquote{padding:5px 15px;min-height:35px;line-height:1.6;color:#333}#blog-news{margin-left:15px}#cnblogs_post_body img{max-width:660px}#cnblogs_post_body table{max-width:670px}@media only screen and (max-width:767px){body{color:#000;font-family:"PingFang SC","Helvetica Neue","Helvetica","Arial","Microsoft Yahei",sans-serif;font-size:12px;min-height:101%;background:url()top center #cbdcec;background-size:100%auto;background-attachment:fixed}#home{width:auto;min-width:unset}#mainContent{word-break:break-word;width:auto;float:none}#main{min-width:unset}#sideBar{margin-left:0}.postTitle{padding-right:0}#blogTitle{height:40px;clear:both}#blogTitle h1{font-size:160%;font-weight:bold;line-height:1.5em;margin-top:10px;margin-left:10px;width:50%;float:left;display:inline;letter-spacing:1px}#blogTitle h2{margin-top:2em;margin-left:8em;line-height:1.5em;width:50%;float:left;display:inline;font-size:14px}#blogTitle h1 a,#blogTitle h2{color:#0378bb;font-family:"PingFang SC","Helvetica Neue","Helvetica","Arial","Microsoft Yahei",sans-serif;text-shadow:2px 2px 2px #fff}#blogLogo{float:right}.postTitle{float:right;width:100%;clear:both}.postTitle a:link,.postTitle a:visited,.postTitle a:active{color:#0378bb}.postTitle a:hover{color:#f60;text-decoration:underline}#topics .postTitle{font-size:18px;font-weight:bold;border-bottom:1px solid #5ea2d6;line-height:1.5em;padding-left:5px}}body{background:#fff}.blogStats{color:#fff;padding-right:10px;visibility:visible}a#Header1_HeaderTitle:hover{text-decoration:none}#cnblogs_post_body h3{font-size:18px}.postBody{line-height:2;color:#222;font-size:13px}</style>
<style media="only screen and (max-width: 767px)">body{font-size:14px!important;-webkit-text-size-adjust:none}.forpc{display:none!important}#blog_nav_rss{display:none!important}#blog_nav_newpost{display:none!important}.blogpost-body img{max-width:300px!important;height:auto}.blogpost-body p>img{display:block;margin:auto}#green_channel{width:100%}#cnblogs_post_body table{display:block;overflow-x:scroll;-webkit-overflow-scrolling:regular;max-height:800px}#cnblogs_post_body table::-webkit-scrollbar:horizontal{height:12px}#cnblogs_post_body table::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);border-radius:10px;background-color:#f5f5f5}#cnblogs_post_body table::-webkit-scrollbar{width:12px;background-color:#f5f5f5}#cnblogs_post_body table::-webkit-scrollbar-thumb{border-radius:10px;-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3);background-color:#555}#cnblogs_c1{text-align:center;margin:10px auto 0 auto}#cnblogs_c1{width:300px}.commentform{margin-left:10px}.cnblogs-markdown :not(pre,div,td)>code,.blogpost-body :not(pre,div,td)>code{white-space:pre-wrap}</style>
<link type=application/rss+xml rel=alternate href=https://www.cnblogs.com/onepixel/rss>
<link type=application/rsd+xml rel=EditURI href=https://www.cnblogs.com/onepixel/rsd.xml>
<link type=application/wlwmanifest+xml rel=wlwmanifest href=https://www.cnblogs.com/onepixel/wlwmanifest.xml>
<style>.medium-zoom-image{cursor:zoom-in;transition:transform 300ms cubic-bezier(0.2,0,0.2,1)!important}</style>
<meta http-equiv=origin-trial content="As0hBNJ8h++fNYlkq8cTye2qDLyom8NddByiVytXGGD0YVE+2CEuTCpqXMDxdhOMILKoaiaYifwEvCRlJ/9GcQ8AAAB8eyJvcmlnaW4iOiJodHRwczovL2RvdWJsZWNsaWNrLm5ldDo0NDMiLCJmZWF0dXJlIjoiV2ViVmlld1hSZXF1ZXN0ZWRXaXRoRGVwcmVjYXRpb24iLCJleHBpcnkiOjE3MTk1MzI3OTksImlzU3ViZG9tYWluIjp0cnVlfQ=="><meta http-equiv=origin-trial content="AgRYsXo24ypxC89CJanC+JgEmraCCBebKl8ZmG7Tj5oJNx0cmH0NtNRZs3NB5ubhpbX/bIt7l2zJOSyO64NGmwMAAACCeyJvcmlnaW4iOiJodHRwczovL2dvb2dsZXN5bmRpY2F0aW9uLmNvbTo0NDMiLCJmZWF0dXJlIjoiV2ViVmlld1hSZXF1ZXN0ZWRXaXRoRGVwcmVjYXRpb24iLCJleHBpcnkiOjE3MTk1MzI3OTksImlzU3ViZG9tYWluIjp0cnVlfQ=="><meta http-equiv=origin-trial content=A/ERL66fN363FkXxgDc6F1+ucRUkAhjEca9W3la6xaLnD2Y1lABsqmdaJmPNaUKPKVBRpyMKEhXYl7rSvrQw+AkAAACNeyJvcmlnaW4iOiJodHRwczovL2RvdWJsZWNsaWNrLm5ldDo0NDMiLCJmZWF0dXJlIjoiRmxlZGdlQmlkZGluZ0FuZEF1Y3Rpb25TZXJ2ZXIiLCJleHBpcnkiOjE3MTkzNTk5OTksImlzU3ViZG9tYWluIjp0cnVlLCJpc1RoaXJkUGFydHkiOnRydWV9><meta http-equiv=origin-trial content=A6OdGH3fVf4eKRDbXb4thXA4InNqDJDRhZ8U533U/roYjp4Yau0T3YSuc63vmAs/8ga1cD0E3A7LEq6AXk1uXgsAAACTeyJvcmlnaW4iOiJodHRwczovL2dvb2dsZXN5bmRpY2F0aW9uLmNvbTo0NDMiLCJmZWF0dXJlIjoiRmxlZGdlQmlkZGluZ0FuZEF1Y3Rpb25TZXJ2ZXIiLCJleHBpcnkiOjE3MTkzNTk5OTksImlzU3ViZG9tYWluIjp0cnVlLCJpc1RoaXJkUGFydHkiOnRydWV9><meta property=og:image content=https://images2015.cnblogs.com/blog/849589/201601/849589-20160112232510850-2003340583.png><meta http-equiv=origin-trial content=AymqwRC7u88Y4JPvfIF2F37QKylC04248hLCdJAsh8xgOfe/dVJPV3XS3wLFca1ZMVOtnBfVjaCMTVudWM//5g4AAAB7eyJvcmlnaW4iOiJodHRwczovL3d3dy5nb29nbGV0YWdtYW5hZ2VyLmNvbTo0NDMiLCJmZWF0dXJlIjoiUHJpdmFjeVNhbmRib3hBZHNBUElzIiwiZXhwaXJ5IjoxNjk1MTY3OTk5LCJpc1RoaXJkUGFydHkiOnRydWV9><meta name=referrer content=no-referrer><link id=favicon rel="shortcut icon" href="" type=image/svg+xml><style>.sf-hidden{display:none!important}</style><link rel=canonical href=https://www.cnblogs.com/onepixel/p/5126046.html><meta http-equiv=content-security-policy content="default-src 'none'; font-src 'self' data:; img-src 'self' data:; style-src 'unsafe-inline'; media-src 'self' data:; script-src 'unsafe-inline' data:; object-src 'self' data:; frame-src 'self' data:;"><style>img[src="data:,"],source[src="data:,"]{display:none!important}</style></head>
<body class="skin-buildtowin has-navbar has-bannerbar">
 <a name=top></a>
 <a href=https://www.cnblogs.com/cmt/p/17520031.html target=_blank rel=nofollow>
 <div class="bannerbar forpc" style=background-size:contain;background-color:#1600f2;margin-left:-60px>
 <img src="">
 
 <span id=c0_impression style=display:none></span>
 </div>
 </a>
 <div id=bannerbar class="bannerbar-mobile bannerbar-text-mobile formobile sf-hidden">
 
 </div>
 <div id=top_nav class="navbar forpc sf-hidden">
 
 </div>
 <div id=page_begin_html>
 <a href=https://github.com/git-onepixel><img style=position:absolute;top:0px;right:0px;border:0px src=data:, alt="Fork me on GitHub" data-canonical-src=https://s3.amazonaws.com/github/ribbons/forkme_right_green_007200.png></a>
 </div>
 
<div id=home>
<div id=header>
 <div id=blogTitle>
 <a id=lnkBlogLogo href=https://www.cnblogs.com/onepixel/><img id=blogLogo src="" alt=返回主页></a> 
 
<h1><a id=Header1_HeaderTitle class="headermaintitle HeaderMainTitle" href=https://www.cnblogs.com/onepixel/>一像素</a>
</h1>
<h2></h2>
 
 </div>
 <div id=navigator>
 
<ul id=navList>
<li><a id=blog_nav_sitehome class=menu href=https://www.cnblogs.com/>
博客园</a>
</li>
<li>
<a id=blog_nav_myhome class=menu href=https://www.cnblogs.com/onepixel/>
首页</a>
</li>
<li>
<a id=blog_nav_newpost class=menu href="https://i.cnblogs.com/EditPosts.aspx?opt=1">
新随笔</a>
</li>
<li>
<a id=blog_nav_contact class=menu href=https://msg.cnblogs.com/send/%E4%B8%80%E5%83%8F%E7%B4%A0>
联系</a></li>
<li>
<a id=blog_nav_rss class=menu href=javascript:void(0) data-rss=https://www.cnblogs.com/onepixel/rss/>
订阅</a>
</li>
<li>
<a id=blog_nav_admin class=menu href=https://i.cnblogs.com/>
管理</a>
</li>
</ul>
 <div class=blogStats>
 <span id=stats_post_count>随笔 - 35&nbsp; </span>
<span id=stats_article_count>文章 - 12&nbsp; </span>
<span id=stats-comment_count>评论 - 563&nbsp; </span>
<span id=stats-total-view-count>阅读 - 
<span title="总阅读数: 2550489">
255万</span></span>
 </div>
 </div>
</div>
<div id=main>
 <div id=mainContent>
 <div class=forFlow>
 <div id=post_detail>
 
 <div id=topics>
 <div class=post>
 <h1 class=postTitle>
 
<a id=cb_post_title_url class="postTitle2 vertical-middle" href=https://www.cnblogs.com/onepixel/p/5126046.html>
 <span role=heading aria-level=2>判断JS数据类型的四种方法</span>
 
</a><button class="cnblogs-toc-button sf-hidden" title=显示目录导航 aria-expanded=false></button>
 </h1>
 <div class=clear></div>
 <div class=postBody>
 <div id=cnblogs_post_body class="blogpost-body blogpost-body-html">
<p>在 ECMAScript 规范中，共定义了 7 种数据类型，分为 基本类型 和 引用类型 两大类，如下所示：</p>
<blockquote>
<p><span style=line-height:1.5><strong>基本类型</strong>：String、Number、Boolean、Symbol、Undefined、Null</span><strong>&nbsp;</strong></p>
<p><span style=line-height:1.5><strong>引用类型</strong>：Object</span></p>
</blockquote>
<p><span style=line-height:1.5>基本类型也称为简单类型，由于其占据空间固定，是简单的数据段，为了便于提升变量查询速度，将其存储在栈中，即按值访问。</span></p>
<p><span style=line-height:1.5>引用类型也称为复杂类型，由于其值的大小会改变，所以不能将其存放在栈中，否则会降低变量查询速度，因此，其值存储在堆(heap)中，而</span>存储在变量处的值，是一个指针，指向存储对象的内存处，即按址访问。引用类型除 Object 外，还包括 Function 、Array、RegExp、Date 等等。</p>
<p>鉴于 ECMAScript 是松散类型的，因此需要有一种手段来检测给定变量的数据类型。对于这个问题，JavaScript 也提供了多种方法，但遗憾的是，不同的方法得到的结果参差不齐。</p>
<p>下面介绍常用的4种方法，并对各个方法存在的问题进行简单的分析。</p>
<h3><span style=font-size:16px><strong>1、typeof</strong></span><button class="cnblogs-toc-button sf-hidden" title=显示目录导航 aria-expanded=false></button></h3>
<p>typeof 是一个操作符，其右侧跟一个一元表达式，并返回这个表达式的数据类型。返回的结果用该类型的字符串(全小写字母)形式表示，包括以下 7 种：number、boolean、symbol、string、object、undefined、function 等。</p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_188188 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><div class="line number4 index3 alt1">4</div><div class="line number5 index4 alt2">5</div><div class="line number6 index5 alt1">6</div><div class="line number7 index6 alt2">7</div><div class="line number8 index7 alt1">8</div><div class="line number9 index8 alt2">9</div><div class="line number10 index9 alt1">10</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp keyword">typeof</code> <code class="csharp string">''</code><code class="csharp plain">; </code><code class="csharp comments">// string 有效</code></div><div class="line number2 index1 alt1"><code class="csharp keyword">typeof</code> <code class="csharp plain">1; </code><code class="csharp comments">// number 有效</code></div><div class="line number3 index2 alt2"><code class="csharp keyword">typeof</code> <code class="csharp plain">Symbol(); </code><code class="csharp comments">// symbol 有效</code></div><div class="line number4 index3 alt1"><code class="csharp keyword">typeof</code> <code class="csharp keyword">true</code><code class="csharp plain">; </code><code class="csharp comments">//boolean 有效</code></div><div class="line number5 index4 alt2"><code class="csharp keyword">typeof</code> <code class="csharp plain">undefined; </code><code class="csharp comments">//undefined 有效</code></div><div class="line number6 index5 alt1"><code class="csharp keyword">typeof</code> <code class="csharp keyword">null</code><code class="csharp plain">; </code><code class="csharp comments">//object 无效</code></div><div class="line number7 index6 alt2"><code class="csharp keyword">typeof</code> <code class="csharp plain">[] ; </code><code class="csharp comments">//object 无效</code></div><div class="line number8 index7 alt1"><code class="csharp keyword">typeof</code> <code class="csharp keyword">new</code> <code class="csharp plain">Function(); </code><code class="csharp comments">// function 有效</code></div><div class="line number9 index8 alt2"><code class="csharp keyword">typeof</code> <code class="csharp keyword">new</code> <code class="csharp plain">Date(); </code><code class="csharp comments">//object 无效</code></div><div class="line number10 index9 alt1"><code class="csharp keyword">typeof</code> <code class="csharp keyword">new</code> <code class="csharp plain">RegExp(); </code><code class="csharp comments">//object 无效</code></div></div></table></div></div>
</div>
<p>有些时候，typeof 操作符会返回一些令人迷惑但技术上却正确的值：</p>
<ul>
<li>对于基本类型，除 null 以外，均可以返回正确的结果。</li>
<li>对于引用类型，除 function 以外，一律返回 object 类型。</li>
<li>对于 null ，返回 object 类型。</li>
<li>对于 function 返回 &nbsp;function 类型。</li>
</ul>
<p>其中，null 有属于自己的数据类型 Null ， 引用类型中的 数组、日期、正则 也都有属于自己的具体类型，而 typeof 对于这些类型的处理，只返回了处于其原型链最顶端的 Object 类型，没有错，但不是我们想要的结果。</p>
<h3><span style=font-size:16px><strong>2、instanceof</strong></span><button class="cnblogs-toc-button sf-hidden" title=显示目录导航 aria-expanded=false></button></h3>
<p>instanceof 是用来判断 A 是否为 B 的实例，表达式为：A instanceof B，如果 A 是 B 的实例，则返回 true,否则返回 false。 在这里需要特别注意的是：<span style=color:rgba(0,0,0,1)><strong>instanceof 检测的是原型</strong></span>，我们用一段伪代码来模拟其内部执行过程：</p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_216461 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><div class="line number4 index3 alt1">4</div><div class="line number5 index4 alt2">5</div><div class="line number6 index5 alt1">6</div><div class="line number7 index6 alt2">7</div><div class="line number8 index7 alt1">8</div><div class="line number9 index8 alt2">9</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp plain">instanceof (A,B) = {</code></div><div class="line number2 index1 alt1"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp keyword">var</code> <code class="csharp plain">L = A.__proto__;</code></div><div class="line number3 index2 alt2"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp keyword">var</code> <code class="csharp plain">R = B.prototype;</code></div><div class="line number4 index3 alt1"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp keyword">if</code><code class="csharp plain">(L === R) {</code></div><div class="line number5 index4 alt2"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp comments">// A的内部属性 __proto__ 指向 B 的原型对象</code></div><div class="line number6 index5 alt1"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp keyword">return</code> <code class="csharp keyword">true</code><code class="csharp plain">;</code></div><div class="line number7 index6 alt2"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp plain">}</code></div><div class="line number8 index7 alt1"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;&nbsp;</code><code class="csharp keyword">return</code> <code class="csharp keyword">false</code><code class="csharp plain">;</code></div><div class="line number9 index8 alt2"><code class="csharp plain">}</code></div></div></table></div></div>
</div>
<p>从上述过程可以看出，当 A 的 __proto__ 指向 B 的 prototype 时，就认为 A 就是 B 的实例，我们再来看几个例子：</p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_473245 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><div class="line number4 index3 alt1">4</div><div class="line number5 index4 alt2">5</div><div class="line number6 index5 alt1">6</div><div class="line number7 index6 alt2">7</div><div class="line number8 index7 alt1">8</div><div class="line number9 index8 alt2">9</div><div class="line number10 index9 alt1">10</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp plain">[] instanceof Array; </code><code class="csharp comments">// true</code></div><div class="line number2 index1 alt1"><code class="csharp plain">{} instanceof Object;</code><code class="csharp comments">// true</code></div><div class="line number3 index2 alt2"><code class="csharp keyword">new</code> <code class="csharp plain">Date() instanceof Date;</code><code class="csharp comments">// true</code></div><div class="line number4 index3 alt1">&nbsp;</div><div class="line number5 index4 alt2"><code class="csharp plain">function Person(){};</code></div><div class="line number6 index5 alt1"><code class="csharp keyword">new</code> <code class="csharp plain">Person() instanceof Person;</code></div><div class="line number7 index6 alt2">&nbsp;</div><div class="line number8 index7 alt1"><code class="csharp plain">[] instanceof Object; </code><code class="csharp comments">// true</code></div><div class="line number9 index8 alt2"><code class="csharp keyword">new</code> <code class="csharp plain">Date() instanceof Object;</code><code class="csharp comments">// true</code></div><div class="line number10 index9 alt1"><code class="csharp keyword">new</code> <code class="csharp plain">Person instanceof Object;</code><code class="csharp comments">// true</code></div></div></table></div></div>
</div>
<p>我们发现，虽然 instanceof 能够判断出 [ ] 是Array的实例，但它认为 [ ] 也是Object的实例，为什么呢？</p>
<p>我们来分析一下 [ ]、Array、Object 三者之间的关系：</p>
<p>从 instanceof 能够判断出 [ ].__proto__ &nbsp;指向 Array.prototype，而 Array.prototype.__proto__ 又指向了Object.prototype，最终 Object.prototype.__proto__ 指向了null，标志着原型链的结束。因此，[]、Array、Object 就在内部形成了一条原型链：</p>
<p><img style=vertical-align:baseline src="" alt width=569 height=81 class=medium-zoom-image></p>
<p>从原型链可以看出，[] 的 __proto__ &nbsp;直接指向Array.prototype，间接指向 Object.prototype，所以按照&nbsp;instanceof&nbsp;的判断规则，[] 就是Object的实例。依次类推，类似的 new Date()、new Person() 也会形成一条对应的原型链 。因此<span style=color:rgba(0,0,0,1)>，<strong>instanceof 只能用来判断两个对象是否属于实例关系</strong></span><strong>， 而不能判断一个对象实例具体属于哪种类型。</strong></p>
<p><span class=fontstyle0>instanceof <span class=fontstyle2>操作符的问题在于，它假定只有一个全局执行环境。如果网页中包含多个框架，那实</span></span><span class=fontstyle0><span class=fontstyle2>际上就存在两个以上不同的全局执行环境，从而存在两个以上不同版本的<span class=fontstyle0><span class=fontstyle2>构造函数。如果你从</span></span></span></span><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2>一个框架向另一个框架传入一个数组，那么传入的数组与在第二个框架中原生创建的数组分别具有各自</span></span></span></span><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2>不同的构造函数。</span></span></span></span></p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_69872 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><div class="line number4 index3 alt1">4</div><div class="line number5 index4 alt2">5</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp keyword">var</code> <code class="csharp plain">iframe = document.createElement(</code><code class="csharp string">'iframe'</code><code class="csharp plain">);</code></div><div class="line number2 index1 alt1"><code class="csharp plain">document.body.appendChild(iframe);</code></div><div class="line number3 index2 alt2"><code class="csharp plain">xArray = window.frames[0].Array;</code></div><div class="line number4 index3 alt1"><code class="csharp keyword">var</code> <code class="csharp plain">arr = </code><code class="csharp keyword">new</code> <code class="csharp plain">xArray(1,2,3); </code><code class="csharp comments">// [1,2,3]</code></div><div class="line number5 index4 alt2"><code class="csharp plain">arr instanceof Array; </code><code class="csharp comments">// false</code></div></div></table></div></div>
</div>
<p><em id=__mceDel><em id=__mceDel><em id=__mceDel></em></em></em><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2><span class=fontstyle3>针对数组的这个问题，ES5&nbsp;<span class=fontstyle2>提供了 <span class=fontstyle0>Array.isArray()&nbsp;<span class=fontstyle2>方法 。该方法用以确认某个对象本身是否为 Array 类型</span></span></span></span></span></span></span></span><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2><span class=fontstyle3><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2>，而不区分该对象在哪个环境中创建。</span></span></span></span></span></span></span></span></p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_136531 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp keyword">if</code> <code class="csharp plain">(Array.isArray(value)){</code></div><div class="line number2 index1 alt1"><code class="csharp spaces">&nbsp;&nbsp;&nbsp;</code><code class="csharp comments">//对数组执行某些操作</code></div><div class="line number3 index2 alt2"><code class="csharp plain">}</code></div></div></table></div></div>
</div>
<p><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2><span class=fontstyle3><span class=fontstyle2><span class=fontstyle0><span class=fontstyle2><span class=fontstyle0><span class=fontstyle4><span class=fontstyle0><span class=fontstyle2>Array.isArray() 本质上检测的是对象的 [[Class]] 值，[[Class]] 是对象的一个内部属性，里面包含了对象的类型信息，其格式为 [object Xxx] ，Xxx 就是对应的具体类型 。对于数组而言，[[Class]] 的值就是 [object Array] 。</span></span></span></span></span></span></span></span></span></span></span></span></p>
<h3><span style=font-size:16px><strong>3、constructor</strong></span><button class="cnblogs-toc-button sf-hidden" title=显示目录导航 aria-expanded=false></button></h3>
<p>当一个函数 F被定义时，JS引擎会为F添加 prototype 原型，然后再在 prototype上添加一个 constructor 属性，并让其指向 F 的引用。如下所示：</p>
<p><img src= alt class=medium-zoom-image></p>
<p>当执行 var f = new F() 时，F 被当成了构造函数，f 是F的实例对象，此时 F 原型上的 constructor 传递到了 f 上，因此 f.constructor == F</p>
<p><img src="" alt class=medium-zoom-image></p>
<p>可以看出，F 利用原型对象上的 constructor 引用了自身，当 F 作为构造函数来创建对象时，原型上的 constructor 就被遗传到了新创建的对象上， 从原型链角度讲，构造函数 F 就是新对象的类型。这样做的意义是，让新对象在诞生以后，就具有可追溯的数据类型。</p>
<p>同样，JavaScript 中的内置对象在内部构建时也是这样做的：</p>
<p><img src="" alt class=medium-zoom-image></p>
<p><strong>细节问题：</strong></p>
<blockquote>
<p>1. null 和 undefined 是无效的对象，因此是不会有 constructor 存在的，这两种类型的数据需要通过其他方式来判断。</p>
<p>2. 函数的 constructor 是不稳定的，这个主要体现在自定义对象上，当开发者重写 prototype 后，原有的 constructor 引用会丢失，constructor 会默认为 Object</p>
</blockquote>
<p><img src="" alt class=medium-zoom-image></p>
<p>为什么变成了 Object？</p>
<p>因为 prototype 被重新赋值的是一个 { }， { } 是 new Object() 的字面量，因此 new Object() 会将 Object 原型上的 constructor 传递给 { }，也就是 Object 本身。</p>
<p>因此，为了规范开发，在重写对象原型时一般都需要重新给 constructor 赋值，以保证对象实例的类型不被篡改。</p>
<h3><span style=font-size:16px><strong>4、toString</strong></span><button class="cnblogs-toc-button sf-hidden" title=显示目录导航 aria-expanded=false></button></h3>
<p>toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。</p>
<p>对于 Object 对象，直接调用 toString()&nbsp; 就能返回 [object Object] 。而对于其他对象，则需要通过 call / apply 来调用才能返回正确的类型信息。</p>
<div class="cnblogs_Highlighter sh-gutter">
<div><div id=highlighter_427067 class="syntaxhighlighter csharp"><div class="toolbar sf-hidden"></div><table border=0 cellpadding=0 cellspacing=0><tbody><tr><td class=gutter><div class="line number1 index0 alt2">1</div><div class="line number2 index1 alt1">2</div><div class="line number3 index2 alt2">3</div><div class="line number4 index3 alt1">4</div><div class="line number5 index4 alt2">5</div><div class="line number6 index5 alt1">6</div><div class="line number7 index6 alt2">7</div><div class="line number8 index7 alt1">8</div><div class="line number9 index8 alt2">9</div><div class="line number10 index9 alt1">10</div><div class="line number11 index10 alt2">11</div><div class="line number12 index11 alt1">12</div><div class="line number13 index12 alt2">13</div><td class=code><div class=container><div class="line number1 index0 alt2"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp string">''</code><code class="csharp plain">) ;&nbsp;&nbsp; </code><code class="csharp comments">// [object String]</code></div><div class="line number2 index1 alt1"><code class="csharp plain">Object.prototype.toString.call(1) ;&nbsp;&nbsp;&nbsp; </code><code class="csharp comments">// [object Number]</code></div><div class="line number3 index2 alt2"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">true</code><code class="csharp plain">) ; </code><code class="csharp comments">// [object Boolean]</code></div><div class="line number4 index3 alt1"><code class="csharp plain">Object.prototype.toString.call(Symbol()); </code><code class="csharp comments">//[object Symbol]</code></div><div class="line number5 index4 alt2"><code class="csharp plain">Object.prototype.toString.call(undefined) ; </code><code class="csharp comments">// [object Undefined]</code></div><div class="line number6 index5 alt1"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">null</code><code class="csharp plain">) ; </code><code class="csharp comments">// [object Null]</code></div><div class="line number7 index6 alt2"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">new</code> <code class="csharp plain">Function()) ; </code><code class="csharp comments">// [object Function]</code></div><div class="line number8 index7 alt1"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">new</code> <code class="csharp plain">Date()) ; </code><code class="csharp comments">// [object Date]</code></div><div class="line number9 index8 alt2"><code class="csharp plain">Object.prototype.toString.call([]) ; </code><code class="csharp comments">// [object Array]</code></div><div class="line number10 index9 alt1"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">new</code> <code class="csharp plain">RegExp()) ; </code><code class="csharp comments">// [object RegExp]</code></div><div class="line number11 index10 alt2"><code class="csharp plain">Object.prototype.toString.call(</code><code class="csharp keyword">new</code> <code class="csharp plain">Error()) ; </code><code class="csharp comments">// [object Error]</code></div><div class="line number12 index11 alt1"><code class="csharp plain">Object.prototype.toString.call(document) ; </code><code class="csharp comments">// [object HTMLDocument]</code></div><div class="line number13 index12 alt2"><code class="csharp plain">Object.prototype.toString.call(window) ; </code><code class="csharp comments">//[object global] window 是全局对象 global 的引用</code></div></div></table></div></div>
</div>
<p>&nbsp;</p>
<p>原创发布 &nbsp;@ <a href=http://www.cnblogs.com/onepixel/p/5126046.html target=_blank rel=noopener>一像素</a>&nbsp; 2016.04</p>
<p>&nbsp;</p>
</div>
<div class=clear></div>
<div id=blog_post_info_block role=contentinfo>
<div id=BlogPostCategory>
 分类: 
 <a href=https://www.cnblogs.com/onepixel/category/763999.html target=_blank>JS</a>
</div>
<div id=EntryTag>
 标签: 
 <a href=https://www.cnblogs.com/onepixel/tag/typeof/>typeof</a>
, <a href=https://www.cnblogs.com/onepixel/tag/instanceof/>instanceof</a>
, <a href=https://www.cnblogs.com/onepixel/tag/constructor/>constructor</a>
, <a href=https://www.cnblogs.com/onepixel/tag/tostring/>tostring</a>
</div>
 <div id=blog_post_info>
<div id=green_channel>
 <a href=javascript:void(0) id=green_channel_digg>好文要顶</a>
 <a id=green_channel_follow href=javascript:void(0)>关注我</a>
 <a id=green_channel_favorite href=javascript:void(0)>收藏该文</a>
 <a id=green_channel_wechat href=javascript:void(0) title=分享至微信><img src= alt></a>
</div>
<div id=author_profile>
 <div id=author_profile_info class=author_profile_info>
 <a href=https://home.cnblogs.com/u/onepixel/ target=_blank><img src="" class=author_avatar alt></a>
 <div id=author_profile_detail class=author_profile_info>
 <a href=https://home.cnblogs.com/u/onepixel/>一像素</a>
 <br>
 <a href=https://home.cnblogs.com/u/onepixel/followers/>粉丝 - <span class=follower-count>1659</span></a>
 <a href=https://home.cnblogs.com/u/onepixel/followees/>关注 - <span class=following-count>32</span></a><br>
 </div>
 </div>
 <div class=clear></div>
 <div id=author_profile_honor></div>
 <div id=author_profile_follow class=follow-tip>
 <a href=javascript:void(0)>+加关注</a>
 </div>
</div>
<div id=div_digg>
 <div class=diggit>
 <span class=diggnum id=digg_count>38</span>
 </div>
 <div class=buryit>
 <span class=burynum id=bury_count>0</span>
 </div>
 <div class=clear></div>
 <div class=diggword id=digg_tips>
 </div>
 <div id=vip_tip><a class=tip href=https://cnblogs.vip/ target=_blank>升级成为会员</a></div>
</div>
</div>
 <div class=clear></div>
 <div id=post_next_prev>
 <a href=https://www.cnblogs.com/onepixel/p/5123115.html class=p_n_p_prefix>« </a> 上一篇： <a href=https://www.cnblogs.com/onepixel/p/5123115.html data-featured-image title="发布于 2016-01-12 03:02">数组常用操作方法总结</a>
 <br>
 <a href=https://www.cnblogs.com/onepixel/p/5140944.html class=p_n_p_prefix>» </a> 下一篇： <a href=https://www.cnblogs.com/onepixel/p/5140944.html data-featured-image title="发布于 2016-01-19 01:14">细说 JavaScript 七种数据类型</a>
</div>
</div>
 </div>
 <div class=postDesc>posted @ 
<span id=post-date data-last-update-days=1990.9584998925254 data-date-created=BlogServer.Application.Dto.BlogPost.BlogPostDto data-date-updated="2018-06-23 11:57" aria-expanded=false>2016-01-13 00:18</span>&nbsp;
<a href=https://www.cnblogs.com/onepixel/>一像素</a>&nbsp;
阅读(<span id=post_view_count>222187</span>)&nbsp;
评论(<span id=post_comment_count>14</span>)&nbsp;
<a href="https://i.cnblogs.com/EditPosts.aspx?postid=5126046" rel=nofollow>编辑</a>&nbsp;
<a href=javascript:void(0)>收藏</a>&nbsp;
<a href=javascript:void(0)>举报</a>
</div>
 </div>
 
 
 </div>
</div>
<a id=!comments></a>
<div id=blog-comments-placeholder class=sf-hidden></div>
<div id=comment_form class=commentform>
 <a name=commentform></a>
 <div id=divCommentShow></div>
 <div id=comment_nav>
 <a class=comment-nav-left href=https://www.cnblogs.com/cmt/p/17520031.html target=_blank>会员救园</a>
 <div class=comment-nav-right>
 <span id=span_refresh_tips></span><a href=#>刷新页面</a><a href=#top>返回顶部</a>
 </div>
 </div>
 <div id=comment_form_container><div class=login_tips>
 登录后才能查看或发表评论，立即 <a rel=nofollow href=javascript:void(0) class=underline>登录</a> 或者
 <a href=https://www.cnblogs.com/>逛逛</a> 博客园首页
</div>
</div>
 <div class=ad_text_commentbox id=ad_text_under_commentbox></div>
 <div id=cnblogs_ch><a href=https://www.cnblogs.com/cmt/p/17520031.html target=_blank>【推荐】会员救园：园子走出困境的唯一希望，到年底有多少会员</a><br><a href=https://click.aliyun.com/m/1000384995/ target=_blank>【推荐】阿里云热销爆款云服务器，新老同享一口价99元/年</a><br></div>
 <div id=opt_under_post></div>
 <div id=cnblogs_c1 class=under-post-card style=display:none>
 
 </div>
 <div id=under_post_card1><div class=under-post-card>
<b>编辑推荐：</b>
<br>
· <a href=https://www.cnblogs.com/huangxincheng/p/17874509.html target=_blank>聊一聊 .NET高级调试 中的一些内存术语</a>
 <br>
· <a href=https://www.cnblogs.com/grey-wolf/p/17871750.html target=_blank>安卓端出现 https 请求失败的一次问题排查</a>
 <br>
· <a href=https://www.cnblogs.com/WindrunnerMax/p/17871444.html target=_blank>初探 webpack 之单应用多端构建</a>
 <br>
· <a href=https://www.cnblogs.com/pengze0902/p/17866309.html target=_blank>深入解析 C# List &lt; T &gt; 的源码</a>
 <br>
· <a href=https://www.cnblogs.com/czwy/p/17862702.html target=_blank>.NET 中有多少种定时器</a>
 <br>
</div></div>
 <div id=under_post_card2><div class="itnews under-post-card">
 <b>阅读排行：</b>
 <br>
 · <a href=https://www.cnblogs.com/Can-daydayup/p/17873700.html target=_blank>C#/.NET/.NET Core优秀项目和框架2023年11月简报</a>
 <br>
 · <a href=https://www.cnblogs.com/xueweihan/p/17874185.html target=_blank>叮咚，你的微信年度聊天报告请查收「GitHub 热点速览」</a>
 <br>
 · <a href=https://www.cnblogs.com/waynaqua/p/17873338.html target=_blank>糟了，数据库崩了，又好像没崩</a>
 <br>
 · <a href=https://www.cnblogs.com/xiaolipro/p/17873575.html target=_blank>.NET8 依赖注入</a>
 <br>
 · <a href=https://www.cnblogs.com/edisonchou/p/dotnet_conf_2023_chengdu_introduction.html target=_blank>.NET Conf 2023 Chengdu - 成都会场即将到来！</a>
 <br>
</div></div>
 <div id=HistoryToday class=under-post-card></div>
 
</div>
 </div>
 </div>
 <div id=sideBar>
 <div id=sideBarMain>
 <div id=sidebar_news class=newsItem>
 <h3 class=catListTitle>公告</h3>
<div id=blog-news> 
 <div id=sidebar_news_content>
<div id=profile_block>
 昵称：
 <a href=https://home.cnblogs.com/u/onepixel/>
 一像素
 </a>
 <br>
 园龄：
 <a href=https://home.cnblogs.com/u/onepixel/ title=入园时间：2015-12-02>
 8年
 </a>
 <br>
 粉丝：
 <a class=follower-count href=https://home.cnblogs.com/u/onepixel/followers/>
 1659
 </a>
 <br>
 关注：
 <a class=folowing-count href=https://home.cnblogs.com/u/onepixel/followees/>
 32
 </a>
 <div id=p_b_follow class=follow-tip>
<a href=javascript:void(0)>+加关注</a></div>
 
</div>
</div>
</div>
 
</div>
<div id=sidebar_c3 class=sf-hidden></div>
 <div id=blog-calendar style=display:none></div> 
 <div id=leftcontentcontainer>
 <div id=blog-sidecolumn>
<div id=sidebar_search class=sidebar-block>
 
</div>
<div id=sidebar_recentposts class=sidebar-block><div class=catListEssay>
<h3 class=catListTitle>最新随笔</h3>
 <ul>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/12144364.html>1.深入浅出 Viewport 设计原理</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/10806891.html>2.观察者模式与订阅发布模式的区别</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/articles/10256314.html>3.MAC地址表、ARP缓存、FIB路由表</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/10238221.html>4.国内四大骨干网与十大ISP服务商</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/10230697.html>5.简述移动通信的网络制式</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/9272546.html>6.Linux 开启和关闭 Ping 操作</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/9154884.html>7.centos 修改 mysql 字符集</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/8832776.html>8.JavaScript 内存泄露问题</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/p/8724526.html>9.简单介绍 CPU 的工作原理</a>
 </li>
 <li>
 
<a href=https://www.cnblogs.com/onepixel/articles/7717789.html>10.正则表达式零宽断言详解</a>
 </li>
 </ul>
</div>
</div>
<div id=sidebar_scorerank class=sidebar-block><div class=catListBlogRank>
<h3 class=catListTitle>积分与排名</h3>
<ul>
 <li class=liScore>
 积分 - 
138178
 </li>
 <li class=liRank>
 排名 - 
9597
 </li>
</ul>
</div>
</div>
<div id=sidebar_categories>
 <div id=sidebar_postcategory class="catListPostCategory sidebar-block">
 <h3 class=catListTitle>
 
 <a class=sidebar-card-title-a href=https://www.cnblogs.com/onepixel/post-categories>随笔分类</a>
<span class=sidebar-category-item-count>
 (52)
</span>
 </h3>
 <ul>
 <li data-category-list-item-visible=true style=display:block>
 
<a href=https://www.cnblogs.com/onepixel/category/765754.html style=--cnb-category-item-link-indent-size:calc(0*1em) class=category-item-link rel target>CSS3(3)</a>
 
 </li> 
 <li data-category-list-item-visible=true style=display:block>
 
<a href=https://www.cnblogs.com/onepixel/category/1035472.html style=--cnb-category-item-link-indent-size:calc(0*1em) class=category-item-link rel target>ES6(2)</a>
 
 </li> 
 <li data-category-list-item-visible=true style=display:block>
 
<a href=https://www.cnblogs.com/onepixel/category/792275.html style=--cnb-category-item-link-indent-size:calc(0*1em) class=category-item-link rel target>HTML5(5)</a>
 
 </li> 
 <li data-category-list-item-visible=true style=display:block>
 
<a href=https://www.cnblogs.com/onepixel/category/792316.html style=--cnb-category-item-link-indent-size:calc(0*1em) class=category-item-link rel target>jQuery(1)</a>
 
 </li> 
 <li data-category-list-item-visible=true style=display:block>
 
<a href=https://www.cnblogs.com/onepixel/category/763999.html style=--cnb-category-item-link-indent-size:calc(0*1em) class=category-item-link rel target>JS(25)</a>
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li data-category-list-item-visible=false style=display:none>
 
 
 </li> 
 <li>
 <a href=javascript:void(0)>更多</a>
 </li>
 </ul>
 </div> 
</div>
<div id=sidebar_topviewedposts class=sidebar-block><div class=catListView>
 <h3 class=catListTitle>
 <a href=https://www.cnblogs.com/onepixel/most-viewed class=sidebar-card-title-a>
 阅读排行榜
</a>
 </h3>
 <div id=TopViewPostsBlock>
 <ul style=word-break:break-all>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7674659.html>
 1. 十大经典排序算法（动图演示）(1480481)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5126046.html>
 2. 判断JS数据类型的四种方法(222180)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7092302.html>
 3. 深入浅出 TCP/IP 协议栈(138563)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5062456.html>
 4. 让你分分钟理解 JavaScript 闭包(66244)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/6034307.html>
 5. Vue.js 和 MVVM 小细节(48982)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7021506.html>
 6. Web前端知识体系精简(42518)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/10238221.html>
 7. 国内四大骨干网与十大ISP服务商(35577)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5281796.html>
 8. JavaScript中的 NaN 与 isNaN(35052)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5327594.html>
 9. 使用 Node.js 搭建 Web 服务器(34729)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5300445.html>
 10. H5单页面手势滑屏切换原理(32363)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/8724526.html>
 11. 简单介绍 CPU 的工作原理(31918)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5024903.html>
 12. 认识原型对象和原型链(27949)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5141566.html>
 13. JavaScript 中的四舍五入(27754)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5043523.html>
 14. 深入理解 new 操作符(27132)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5218904.html>
 15. JavaScript正则表达式精简(24283)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7143769.html>
 16. Node.js 事件循环机制(24137)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5140944.html>
 17. 细说 JavaScript 七种数据类型(21619)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5090799.html>
 18. 探索JS引擎工作原理(18447)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/10806891.html>
 19. 观察者模式与订阅发布模式的区别(17766)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5248200.html>
 20. React 基础入门(14432)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7078617.html>
 21. requestAnimationFrame 知多少？(13441)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7337248.html>
 22. 详解 undefined 与 null 的区别(11430)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7468343.html>
 23. 小端字节序与大端字节序(11407)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5036369.html>
 24. 函数作用域和作用域链(11152)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5143863.html>
 25. 深入理解 call，apply 和 bind(11062)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5156442.html>
 26. 快速构建H5单页面切换应用(9961)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5123115.html>
 27. 数组常用操作方法总结(8328)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/10230697.html>
 28. 简述移动通信的网络制式(7958)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/8832776.html>
 29. JavaScript 内存泄露问题(6788)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/12144364.html>
 30. 深入浅出 Viewport 设计原理(5126)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5097584.html>
 31. 浅析 jQuery 内部架构设计(5112)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7159529.html>
 32. TTL 和 DNS TTL 的区别(4832)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/9272546.html>
 33. Linux 开启和关闭 Ping 操作(4336)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7422820.html>
 34. V8引擎的垃圾回收策略(2726)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/9154884.html>
 35. centos 修改 mysql 字符集(1395)
 </a>
 </li>
 </ul>
 </div>
</div></div>
<div id=sidebar_topcommentedposts class=sidebar-block><div class=catListFeedback>
 <h3 class=catListTitle>
 <a href=https://www.cnblogs.com/onepixel/most-commented class=sidebar-card-title-a>评论排行榜</a>
 </h3>
 <div id=TopFeedbackPostsBlock>
 <ul style=word-break:break-all>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7674659.html>
 1. 十大经典排序算法（动图演示）(145)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5062456.html>
 2. 让你分分钟理解 JavaScript 闭包(90)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7092302.html>
 3. 深入浅出 TCP/IP 协议栈(50)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/6034307.html>
 4. Vue.js 和 MVVM 小细节(45)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7021506.html>
 5. Web前端知识体系精简(25)
 </a>
 </li>
 </ul>
 </div>
</div></div>
<div id=sidebar_topdiggedposts class=sidebar-block>
<div id=topdigg_posts_wrap>
 <div class=catListView>
 <h3 class=catListTitle>
 <a href=https://www.cnblogs.com/onepixel/most-liked class=sidebar-card-title-a>推荐排行榜</a>
 </h3>
 <div id=TopDiggPostsBlock>
 <ul style=word-break:break-all>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7674659.html>
 1. 十大经典排序算法（动图演示）(471)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/5062456.html>
 2. 让你分分钟理解 JavaScript 闭包(209)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7092302.html>
 3. 深入浅出 TCP/IP 协议栈(152)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/7021506.html>
 4. Web前端知识体系精简(102)
 </a>
 </li>
 <li>
 <a href=https://www.cnblogs.com/onepixel/p/6034307.html>
 5. Vue.js 和 MVVM 小细节(60)
 </a>
 </li>
 </ul>
 </div>
 </div>
</div></div><div id=sidebar_recentcomments class=sidebar-block><div class=catListComment>
<h3 class=catListTitle><a href=https://www.cnblogs.com/onepixel/comments class=sidebar-card-title-a>最新评论</a></h3>
 <div class=RecentCommentBlock>
 <ul>
 <li class=recent_comment_title><a href=https://www.cnblogs.com/onepixel/p/5043523.html>1. Re:深入理解 new 操作符</a></li>
 <li class=recent_comment_body><p>膜拜大神</p>
</li>
 <li class=recent_comment_author>--Leelom</li>
 <li class=recent_comment_title><a href=https://www.cnblogs.com/onepixel/p/7674659.html>2. Re:十大经典排序算法（动图演示）</a></li>
 <li class=recent_comment_body><p>图片帧数少点就更好了</p>
</li>
 <li class=recent_comment_author>--DATA_MONK</li>
 <li class=recent_comment_title><a href=https://www.cnblogs.com/onepixel/p/7674659.html>3. Re:十大经典排序算法（动图演示）</a></li>
 <li class=recent_comment_body><p>你用的语言是javascript吗？</p>
</li>
 <li class=recent_comment_author>--EricGo</li>
 <li class=recent_comment_title><a href=https://www.cnblogs.com/onepixel/p/7674659.html>4. Re:十大经典排序算法（动图演示）</a></li>
 <li class=recent_comment_body><p>点赞，收藏</p>
</li>
 <li class=recent_comment_author>--风口旁的猪</li>
 <li class=recent_comment_title><a href=https://www.cnblogs.com/onepixel/p/12144364.html>5. Re:深入浅出 Viewport 设计原理</a></li>
 <li class=recent_comment_body>写得太牛了！ 特意登录来评论感谢一下，这两天闲下来又时间来学习，关于像素这一直都懵懵懂懂的，但是网上的资料又参差不齐的，偶然搜到你这篇文章，仔细读了两遍以后，发现写得是真的好啊！ 谢谢谢！...</li>
 <li class=recent_comment_author>--timz</li>
 </ul>
 </div>
</div>
</div>
</div>
 
 </div> 
 </div>
 </div>
 <div class=clear></div>
 </div>
 <div class=clear></div>
 <div id=footer>
 
Copyright © 2023 一像素
<br><span id=poweredby>Powered by .NET 8.0 on Kubernetes</span>
 </div>
</div>
 
 
 
<iframe style=visibility:hidden;display:none></iframe>
<div style=z-index:998;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);display:none;flex-direction:column;align-items:center;justify-content:center>
 
 </div><iframe width=0 height=0 style=display:none></iframe>